<template>
  <div class="goodsDetail">
    <navbar :title="currentItem.simpleTitle"></navbar>
   <div class="blank"></div>
    <swiper :img="currentItem.img"></swiper>
    <goods-info :item="currentItem"></goods-info>
    <evaluation :item="currentItem"></evaluation>
    <div class="blank"></div>
    <goods-action :item="currentItem"></goods-action>
  </div>
</template>

<script>
import {goodsList} from "@/data/home";
// import {getHomeData} from "@/network/home";

import GoodsAction from "./components/goodsAction";
import Swiper from "./components/swiper";
import Navbar from "./components/navbar";
import GoodsInfo from "./components/goodsInfo";
import Evaluation from "./components/evaluation";

export default {
  name: "index",
  components: {Evaluation, GoodsInfo, Navbar, Swiper, GoodsAction},
  data() {
    return {
      id: this.$route.query.id,
      goodsList,
      currentItem:{}
    }
  },
  methods: {

  },
  created() {
    // goodsList

    let id = this.id;
    let item = this.goodsList.filter(function (n) {
      return n.id === id
    })
    this.currentItem=item[0];
    // getHomeData().then(res=>{
    //   this.goodsList=res.data.goodsList
    //
    //   let id = this.id;
    //   let item = res.data.goodsList.filter(function (n) {
    //     return n.id === id
    //   })
    //   this.currentItem=item[0];
    // })
  },

}
</script>

<style scoped>
.goodsDetail{
  background-color: #f2f2f2;
  width: 100vw;
  min-height: 100vh;
}
</style>